{% comment %}
Provides the account creation form (and its success message).
{% endcomment %}
{% extends "base.html" %}
{% block user %}
{% endblock %}
{% block content %}
<table id="create_account">
  <tr>
    <td id="create_account_left">
      <div id="create_account_instructions">
{% block instructions %}
        Sign up here for a free account!  We just need a few details.
{% endblock %}
      </div>
      <ol id="create_account_progress" class="step_by_step">
{% block progress %}
        <li class="current_step">Select a name and password
        <li>Generate signup email
        <li>Enter activation code to confirm email
{% endblock %}
      </ol>
    </td>
    <td id="create_account_right">
{% block form %}
      <div id="create_account_success">
        Before we activate your account, we need to confirm your email address.
        We've emailed an activation code to $email.  We've also included a URL
        that you can just click to activate your account, or you can
        <a id="create_account_activation_link">enter your activation code
        here</a>.
      </div>
      <form id="create_account_form">
        <table class="form">
          <tr>
            <td class="label">
              Name:
              <br>
              <span class="tip">
                This is the handle other users will see.
              </span>
            </td>
            <td>
              <input id="create_account_name" type="text" size="20"
                     maxlength="20">
            </td>
            <td class="tip_cell">
              <span id="create_account_name_msg">&nbsp;</span>
            </td>
          </tr>
          <tr>
            <td class="label">
              Email:
              <br>
              <span class="tip">
                We'll send an activation code to this address as part of the
                signup process.
              </span>
            </td>
            <td>
              <input id="create_account_email" type="text" size="20"
                      maxlength="32">
            </td>
            <td class="tip_cell">
              <span id="create_account_email_msg">&nbsp;</span>
            </td>
          </tr>
          <tr>
            <td class="label">
              Password:
            </td>
            <td>
              <input id="create_account_password1" type="password" size="20">
            </td>
            <td rowspan="2" class="tip_cell">
              <span id="create_account_password_msg">&nbsp;</span>
            </td>
          </tr>
          <tr>
            <td class="label">
              Confirm password:
            </td>
            <td>
              <input id="create_account_password2" type="password" size="20">
            </td>
          </tr>
          <tr>
            <td colspan="2" class="control">
              <input id="create_account_button" type="button" value="Sign Up">
            </td>
          </tr>
        </table>
      </form>
{% endblock %}
    </td>
  </tr>
  <tr>
    <td colspan="2" id="create_account_msg">&nbsp;</td>
  </tr>
</table>
{% endblock %}
